@include('Home.head')
<link rel="stylesheet" href="{{ URL::asset('css/home/layui.css') }}">
<style>
    .am-form-horizontal .am-radio,
    .am-form-horizontal .am-form-label{
        padding-top:0 !important
    }
</style>
<body>
<div class="container" id="app">
    <header data-am-widget="header" class="am-header am-header-default my-header">
        <div class="am-header-left am-header-nav">
            <a  onclick="javascript:history.back(-1);" class="">
                <i class="am-header-icon am-icon-chevron-left"></i>
            </a>
        </div>
        <h1 class="am-header-title">
            <a href="#title-link" class="">@{{ title }}</a>
        </h1>
        <div class="am-header-right am-header-nav">
            <a href="/home/member/index" class="">
                <i class="am-header-icon  am-icon-home"></i>
            </a>
        </div>
    </header>
    <div class="my-nav-bar">
    	<ol class="am-breadcrumb">
          <li><a href="/home/member/index">首页</a></li>
          <li><a href="">进货</a></li>
        </ol>
    </div>

    <div class="am-cf cart-panel" id="">
    <div class="pickSelf" style="text-align: right;padding-right: 10px">
            <label class="am-checkbox-inline">
                <input type="checkbox"  v-model="pick" > 自提
            </label>
        </div>
        <div class="am-panel-group" id="accordion">
            <div class="am-panel am-panel-default" v-for="val,index in allgoods">
                <div class="am-panel-hd">
                    <h4 class="am-panel-title" :data-am-collapse="JSON.stringify({parent: '#accordion', target: '#'+val.id})">@{{val.goodsname}}</h4>
                </div>
                <div :id="val.id" class="am-panel-collapse am-collapse">
                    <div class="am-panel-bd">
                        <form class="am-form am-form-horizontal am-cf" v-if="val.specs">
                            <div class="am-form-group">
                                <label for="" class="am-u-sm-4 am-form-label">门店库存</label>
                                <div class="am-u-sm-8">
                                    <input type="number" id="" class="am-input-sm" v-model="val.inventory" disabled>
                                </div>
                            </div>
                            <div class="am-form-group"  v-for = "a,b in val.specs" :key="b">
                                <label class="am-u-sm-5 am-form-label">@{{b}}</label>
                                <div class="am-u-sm-7">
                                    <label class="am-radio am-success" v-for = "c,d in a" :key="d">
                                        <input type="radio" :name="b + val.id" :value="c" data-am-ucheck checked>@{{c}}
                                    </label>
                                </div>
                            </div>
                            <div class="am-form-group">
                                <label for="" class="am-u-sm-4 am-form-label">进货数量</label>
                                <div class="am-u-sm-8">
                                    <input type="number" id="" class="am-input-sm" placeholder="请输入该规格进货量" v-model="retailPurchases">
                                </div>
                            </div>
                            <div class="am-form-group">
                                <label for="" class="am-u-sm-4 am-form-label">进货情况</label>
                                <div class="am-u-sm-8">
                                    <textarea name="" :id="'textarea'+val.id" rows="5" disabled class="am-input-sm" placeholder="请认真确认进货情况再提交" v-model="specifications"></textarea>
                                </div>
                            </div>

                            <button type="button" class="am-btn am-btn-success am-round am-btn-xs am-fr" v-on:click="orderPage(index,specifications,val.gid,val.id)">确认进货</button>
                            <button type="button" class="am-btn am-btn-secondary am-round am-btn-xs am-fr" style="margin-right: 5px;" v-on:click="addSpecs(index,val.id)">添加选择</button>
                            <button type="button" class="am-btn am-btn-warning am-round am-btn-xs am-fr" style="margin-right: 5px;" v-on:click="resetval(val.id)">清空重选</button>
                        </form>

                        <form class="am-form am-form-horizontal am-cf" v-else>
                            <div class="am-form-group">
                                <label for="" class="am-u-sm-4 am-form-label">门店库存</label>
                                <div class="am-u-sm-8">
                                    <input type="number" id="" class="am-input-sm" v-model="val.inventory" disabled>
                                </div>
                            </div>
                            <div class="am-form-group">
                                <label for="" class="am-u-sm-4 am-form-label">进货数量</label>
                                <div class="am-u-sm-8">
                                    <input type="number" id="" class="am-input-sm" placeholder="请输入进货量" v-model="retailPurchases">
                                </div>
                            </div>
                            <button type="button" class="am-btn am-btn-success am-round am-btn-xs am-fr" v-on:click="orderPage(index,retailPurchases,val.gid,val.id)">确认进货</button>
                        </form>

                    </div>
                </div>
            </div>
        </div>
    </div>
    @include('Home.foot')
</div>
</body>
<script src="{{ URL::asset('js/admin/layui/layui.js') }}"></script>
<script>
    var app = new Vue({
        el: "#app",
        data: {
            pick:false, //是否自提
            title: '我要进货',
            allgoods:[],//所有货物
            retailPurchases:'100',//进货数量
            specifications:'',//所有规格
            // specsdetial:'',//所有规格
            order:{
                gid:'',
                specs_txt:''
            }
        },
        methods: {
            
            //初始化 系统管理员列表
            initialize: function () {
                var rico = this
                $.post("/home/stores/getPurchase", {'_token': '{{csrf_token()}}',class:'select'}, function (res) {
                    // console.log(res.data)
                    if (res.code) {
                        rico.allgoods=res.data
                        
                    } else {
                        layer.msg(res.data);
                    }
                });
            },
            orderPage:function (index,retailPurchases,gid,id) {
                var rico = this
                // console.log(retailPurchases,id)
                rico.order.gid = gid
                rico.order.specs_txt = retailPurchases
                if(rico.allgoods[index].specs){
                    if (!$('#textarea'+id).val()) {
                        layer.msg('请先添加选择');
                        return false
                    }
                }
                if(this.retailPurchases<=0) {
                    layer.msg("进货数量不对")
                    return false
                }
                var pick_self = app.pick?1:0;
                $.post("/home/stores/getPurchase", {'_token': '{{csrf_token()}}',class:'purchase',order:rico.order,id:id,pick_self:pick_self}, function (res) {
                    // console.log(res)
                    if (res.code) {
                        window.location.href="/home/stores/orderPage?id="+res.data;
                    } else {
                        layer.msg(res.data);
                    }
                });

                // window.location.href="/home/stores/orderPage";
            },
            // 添加规格
            addSpecs:function (index,id) {
                var rico = this
                // var str = rico.specifications;
                var str = $('#textarea'+id).val();
                // var str = $('#textarea'+id).val(); //先获取原有的值
                if(rico.allgoods[index].specs){
                    // console.log(rico.allgoods[index])
                    for(var i in rico.allgoods[index].specs){
                        str=str + $(":radio[name=" + i + id + "]:checked").val()+ '-' ; //拼接新值
                    }
                }
                str=str+rico.retailPurchases+';'
                $('#textarea'+id).val(str)
                rico.specifications = $('#textarea'+id).val()
            },
            // 清空
            resetval:function (id) {
                $('#textarea'+id).val('')
            }
        },
        //自动执行
        mounted: function () {
            this.initialize();
            // $('#accordion').on('open.collapse.amui', function() {
            //     console.log('折叠菜单打开了！');
            //     // $('form').reset();
            // })
        },
    })
    
</script>
</html>
